﻿<html xmlns="http://www.w3.org/1999/xhtml">

<div id="gallery" class="hovergallery">
  <table>
    <tr>
      <td>
        <img id="image_0"></img>
        <div id="image_footer_0" class="image_footer"></div>
      </td>
      <td>
        <img id="image_1"></img>
        <div id="image_footer_1" class="image_footer"></div>
      </td>
      <td>
        <img id="image_2"></img>
        <div id="image_footer_2" class="image_footer"></div>
      </td>      
      <td>
        <img id="image_3"></img>
        <div id="image_footer_3" class="image_footer"></div>
      </td>
    </tr>
    <tr>
      <td>
        <img id="image_4"></img>
        <div id="image_footer_4" class="image_footer"></div>
      </td>
      <td>
        <img id="image_5"></img>
        <div id="image_footer_5" class="image_footer"></div>
      </td>
      <td>
        <img id="image_6"></img>
        <div id="image_footer_6" class="image_footer"></div>
      </td>      
      <td>
        <img id="image_7"></img>
        <div id="image_footer_7" class="image_footer"></div>
      </td>
    </tr>
  </table>
</div>

<script>
	function runScript() {
		var urlParameter = location.search.split('?')[1];
		selectedItems = new Array(); //global, to be used in filtering
		if (!urlParameter) {
			selectedItems = getRandomGallery();
		} else {
			selectedItems = getTypedGallery(urlParameter);
		}
		setGallery(selectedItems); ///add if not empty
	}
	function getRandomGallery() {
		var items = getAllItems('data/items.csv');
		return shuffleArray(items);
	}

	function getTypedGallery(typeEn) {
		var items = getItemsByType('data/items.csv', typeEn);
		return items;
	}
	
	function filterByPrice() {
		var minPrice = $('#minPrice').val();
		if (minPrice == '') { //empty
			minPrice = 0;
		}
		var maxPrice = $('#maxPrice').val();
		if (maxPrice == '') { //empty
			maxPrice = 100000;
		}
		var filteredItems = filterItemsByPrice(selectedItems, minPrice, maxPrice);
		setGallery(filteredItems);
	}
	
	function setGallery(items) {
		for (var i = 0; i < 8; i++) { //показываем только 8 картинок
			var item = items[i];
			if (item) {
				$('#image_' + i).show();
				$('#image_footer_' + i).show();
				$('#image_' + i).attr('src', 'images/' + item.image);
				var onclick = "setSection('?" + item.model + "')";
				$('#image_' + i).attr('onclick', onclick);
				$('#image_footer_' + i).text(item.typeRu + ' модель ' + item.model + '; ' + item.price + ' грн');
			} else { //hide current field
				$('#image_' + i).hide();
				$('#image_footer_' + i).hide();
			}
		}
	}
</script>

</html>